<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE HTML>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <%@ include file="/WEB-INF/views/include/head.jsp"%> 
        <link rel="stylesheet" href="${ctxStatic}/css/layerSm.css">
        <style>
	        .btn-add{
			    width: 50px;
			    height: 30px;
			    line-height: 30px;
			    background: #595959;
			    color: #ffffff;
			    border-radius: 2px;
			    text-align: center;
			    font-size: 14px;
			    cursor: pointer;
			}
            .btn-add-1{
                position: absolute;
                top: 81px;
                left: 36px;
                width: 61px;
                height:28px;
                line-height:28px;
                border-radius: 3px;
            }

            .btn-add-2{
                border:none;
                width: 60px;
                height: auto;
                line-height: 1;
               
            }
            .btn-add-3{
/*                display:inline-block;
                width: 60px;
                text-decoration: none;
                margin-left:100px;*/
                display: inline-block;
                width: 60px;
                text-decoration: none;
                top: 0px;
                position: absolute;
                margin-left: 100px;
                height: 28px;
            }
           .btnP{
                position: absolute;
                bottom:10px;
                left:130px;
                top: 160px;
            }
            
            .fileInp{
                width:330px;
                border: 1px solid #e0e0e0;
                -webkit-border-radius: 4px;
                -moz-border-radius: 4px;
                border-radius: 4px;
                line-height: 35px;
                padding:0 2px;
                font-size: 11px;
                line-height: 28px;
            }
            
            #importDiv{
                width:330px;
                margin:30px auto;
            }
            .myshop_middle{
		    background:#ffffff;
		    padding:10px 20px 0 20px;
			}
        </style>
        <script type="text/javascript">
            $('.btn-add-1').on('click',function(){
                $('.fileInp').click();
            });
            
            //导出Excel
            function importExcel(t){
            	 $(t).attr("disabled",true);
            	var action=$("#inputForm").attr("action");
            	var form = document.getElementById('inputForm'); 
                var fd = new FormData(form);
                var file=$("#uploadFile");
               if($(file).val()==''){
                	alertInfo("<spring:message code='importExcel_error_msg'/>");
                	$(t).attr("disabled",false);
                	return false;
                } 
                fd.append("file", file);
                var xhr = new XMLHttpRequest();
                if (xhr.upload) {
                    // 文件上传成功或是失败
                    xhr.onreadystatechange = function(e) {
                    	
                        if (xhr.readyState == 4) {
                        	
                        	var result=JSON.parse(xhr.responseText);
                        	 // 提示信息
                            alertInfo(result.message);
                        	
                            if (xhr.status == 200) {
                                // 返回状态
                                if(result.statusCode==STATUSCODEOK){
                                        // 刷新页面
                                        window.parent.frames[0].location.reload();
                                        // 关闭页面
                                        closeWin(); 
                                  }else{
                                      $(t).attr("disabled",false);
                                  }
                                  xhr=null;
                            } 
                        }
                    };
                    
                    // 开始上传
                    xhr.open("POST", action, true);
                    xhr.setRequestHeader("X_FILENAME", file.name);
                    xhr.send(fd);
                }   
            	
            	return false;
            }
            
            function importTemplate(href){
            	
            	$.get(href+"?"+new Date().getTime(),function(result){
            		alert(result);
            		 if(result.statusCode==STATUSCODEOK){
            			 
            			 tipParent(result.message);
            		 }
            	});
            }
        </script>
    </head>
    <body>
        <!--头部-->
        <div id="editPage" class="layerHeader clearfix">
        <!-- 导入数据 -->
    	<p class="headerTitle"><spring:message code="importExcel_import_data"/></p>
			<div class="headerButton clearfix">
            <!-- 取消 -->
            <button type="button" onclick="closeWin()"><spring:message code="btn_cancle"/></button>          
	    </div>
	</div>
        <div class="middle myshop_middle">
            <div id="importDiv">
                <form id="inputForm" action="${action}" method="post" onsubmit="formSubmit(this.action)" enctype="multipart/form-data">
                    <!-- 浏览... -->
                    <p type="button" class="btn-add btn-add-1"><spring:message code="importExcel_browse"/></p>
                    <input id="uploadFile" name="file" type="file" class="fileInp"/>　
                    <div class="btnP">
                        <div style="vertical-align: top">
                        <input id="btnImportSubmit" class="btn-add btn-add-2" type="button"  onclick="importExcel(this)" value="导入"/>
                        <!-- 下载模板 -->
                        <a href="${template}" class="btn-add btn-add-3" type="button"  ><spring:message code="importExcel_export"/></a>
                        </div>
                    </div>
                     <p style="margin-top:-10px;"><spring:message code="importExcel_message"/></p> 
                </form>
            </div>
        </div>
        <script>
            var windowH = window.innerHeight
                ||document.documentElement.clientHeight
                ||document.body.clientHeight
            $('.middle').css('height',windowH - 40);

            $('.btn-add-1').on('click',function(){
                $('.fileInp').click()
            })
        </script>
    </body>
</html>